<template>
  <view class="container">
    <uv-navbar title="重置密码" placeholder autoBack></uv-navbar>
    <view style="display: flex;flex-direction: column;align-items: center;">
      <img class="logo" src="/static/images/logo.png" alt="" />
<!--      <view class="desc">
        您好,欢迎来到北京单商户APP
      </view> -->
    </view>
    <view class="main">
      <view class="iptItme">
        <view class="label">
          手机号
        </view>
        <input class="ipt" type="text" placeholder-class="styles" v-model="fromLine.phone" placeholder="请输入手机号">
      </view>
      <view class="iptItme">
        <view class="label">
          验证码
        </view>
        <view class="ipt" style="display: flex;align-items: center;padding-left: 0;">
          <input class="ipt" style="flex: 1;" type="text" placeholder-class="styles" v-model="fromLine.phone" placeholder="请输入验证码">
          <text style="font-weight: 500;font-size: 28rpx;color: #1C76FC;">获取验证码</text>
        </view>
      </view>
      <view class="iptItme">
        <view class="label">
          密码
        </view>
        <input class="ipt" type="text" placeholder-class="styles" v-model="fromLine.pwd" placeholder="请输入密码">
      </view>
      <view class="iptItme">
        <view class="label">
          确认密码
        </view>
        <input class="ipt" type="text" placeholder-class="styles" v-model="fromLine.inviteCode" placeholder="请再次输入密码">
      </view>
    </view>
    <view class="footer">
<!--      <view class="agreement" @click="handleToggle">
        <image class="round" :src="checked?'/static/images/roundActive.png':'/static/images/round.png'" mode="">
        </image>
        已阅读并同意
        <text class="xiey" @click.stop="toXiyiPage('1')">《用户协议》</text>
        和
        <text class="xiey" @click.stop="toXiyiPage('2')">《隐私政策》</text>
      </view> -->
      <view class="loginBtn">确定</view>
    </view>
  </view>
</template>

<script>
  export default {
    data() {
      return {
        fromLine: {
          phone: "",
          pwd: "",
          inviteCode: ""
        },
        checked: false
      }
    },
    methods: {
      toXiyiPage(){
        
      }
    }
  }
</script>
<style>
  .styles{
    font-weight: 500 !important;
    font-size: 32rpx !important;
    color: #999 !important; 
  }
</style>
<style lang="scss" scoped>
  .container {
    width: 100vw;
    height: 100vh;
    background: #fff;
    .logo{
      width: 128rpx;
      height: 128rpx;
      margin-top: 120rpx;
    }
    .desc{
      font-weight: 500;
      font-size: 36rpx;
      color: #000000;
      margin-top: 20rpx;
      margin-bottom: 20rpx;
    }
    .main{
       padding: 0 28rpx;
       box-sizing: border-box;
       position: relative;
       top: 200rpx;
      .iptItme{
        margin-top: 28rpx;
        .label{
          font-weight: 500;
          font-size: 32rpx;
          color: #000000;
          margin-bottom: 16rpx;
        }
        .ipt{
          width: 100%;
          height: 88rpx;
          background: #F8F8F8;
          border-radius: 40rpx;
          font-weight: 400;
          font-size: 28rpx;
          color: #333;
          padding: 0 30rpx;
          box-sizing: border-box;
        }
      }
      .setting{
        display: flex;
        justify-content: space-between;
        font-weight: 400;
        font-size: 28rpx;
        color: #1C76FC;
        margin-top: 28rpx;
        .toFotPwd{
          
        }
        .codeLogin{
          
        }
      }
    }
    .footer{
      position: fixed;
      width: 100%;
      bottom: 110rpx;
      padding: 0 28rpx;
      box-sizing: border-box;
      .agreement{
        display: flex;
        font-weight: 400;
        font-size: 24rpx;
        color: #999999;
        align-items: center;
        justify-content: center;
        margin-bottom: 28rpx;
        .round{
          width: 24rpx;
          height: 24rpx;
        }
        .xiey{
          color: #1C76FC !important;
        }
      }
      .loginBtn{
        width: 100%;
        height: 88rpx;
        background: #F86F03;
        border-radius: 40rpx;
        font-weight: 500;
        font-size: 32rpx;
        color: #FFFFFF;
        text-align: center;
        line-height: 88rpx;
      }
    }
  }
</style>